@charset "utf-8";

html, body, div, p, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, input, select, button, textarea, iframe, table, th, td {margin: 0 auto; padding: 0; }
img { border: 0 none; vertical-align: top; }
ul,li,dl,dd,dt { list-style-type: none; }
i,em,cite { font-style: normal; }
body {  -webkit-text-size-adjust:none;  font-family:"微软雅黑";}
a{ text-decoration: none; }
.clear,.cle {clear:both;}
a,area { blr:expression(this.onFocus=this.blur()) }   
a:focus { outline: none; }    
.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;}.i_tcase_img
.animated.infinite{-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite;}
.animated.maxtime{-webkit-animation-duration:2s;animation-duration:2s;}
@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-100%);transform:translateX(-100%);}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0);}}
@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-100%);transform:translateX(-100%);}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0);}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft;}
@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-200%);transform:translateX(-200%);}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0);}}
@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-200%);transform:translateX(-200%);}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0);}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig;}
@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(100%);transform:translateX(100%);}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0);}}
@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(100%);transform:translateX(100%);}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0);}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight;}
@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(200%);transform:translateX(200%);}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0);}}
@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(200%);transform:translateX(200%);}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0);}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig;}
@-webkit-keyframes fadeInTop{0%{opacity:0;-webkit-transform:translateY(-100%);transform:translateY(-100%);}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}}
@keyframes fadeInTop{0%{opacity:0;-webkit-transform:translateY(-100%);transform:translateY(-100%);}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}}.fadeInTop{-webkit-animation-name:fadeInTop;animation-name:fadeInTop;}
@-webkit-keyframes fadeInTopBig{0%{opacity:0;-webkit-transform:translateY(-200%);transform:translateY(-200%);}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}}
@keyframes fadeInTopBig{0%{opacity:0;-webkit-transform:translateY(-200%);transform:translateY(-200%);}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}}.fadeInTopBig{-webkit-animation-name:fadeInTopBig;animation-name:fadeInTopBig;}
@-webkit-keyframes fadeInBottom{0%{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%);}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}}
@keyframes fadeInBottom{0%{opacity:0;-webkit-transform:translateY(100%);transform:translateY(100%);}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);}}.fadeInBottom{-webkit-animation-name:fadeInBottom;animation-name:fadeInBottom;}
@-webkit-keyframes shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes shake{0%,100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}}.shake{opacity:1;-webkit-animation-name:shake;animation-name:shake}
@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes swing{20%{-webkit-transform:rotate(15deg);-ms-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);-ms-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);-ms-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);-ms-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}}.swing{opacity:1;-webkit-transform-origin:top center;-ms-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}
@-webkit-keyframes tada{0%{-webkit-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}@keyframes tada{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);-ms-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);-ms-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);-ms-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);-ms-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}.{opacity:1;-webkit-animation-name:tada;animation-name:tada}
@keyframes fadeMoveLeft{from {margin-left:3px;}to {margin-left:-6px;}}
@-moz-keyframes fadeMoveLeft{from {margin-left:3px;}to {margin-left:-6px;}}
@-webkit-keyframes fadeMoveLeft{from {margin-left:3px;}to {margin-left:-6px;}}.fadeMoveLeft{animation:fadeMoveLeft 0.5s infinite;-moz-animation:fadeMoveLeft 0.5s infinite;-webkit-animation:fadeMoveLeft 0.5s infinite;}
@keyframes fadeMoveRight{from {margin-left:-3px;}to {margin-left:6px;}}
@-moz-keyframes fadeMoveRight{from {margin-left:-3px;}to {margin-left:6px;}}
@-webkit-keyframes fadeMoveRight{from {margin-left:-3px;}to {margin-left:6px;}}.fadeMoveRight{animation:fadeMoveRight 0.5s infinite;-moz-animation:fadeMoveRight 0.5s infinite;-webkit-animation:fadeMoveRight 0.5s infinite;}
@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}
@keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);-ms-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);-ms-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);-ms-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);-ms-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg);transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}
@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);-ms-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-180deg);-ms-transform:perspective(400px) rotateY(-180deg);transform:perspective(400px) rotateY(-180deg)}70%{-webkit-transform:perspective(400px) rotateY(180deg);-ms-transform:perspective(400px) rotateY(180deg);transform:perspective(400px) rotateY(180deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);-ms-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}.flipInY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}
@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}
@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);-ms-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);-ms-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);-ms-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);-ms-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}.flipInX{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}
@-webkit-keyframes pulse{0%{-webkit-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);transform:scale(1)}}
@keyframes pulse{0%{-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}
@-webkit-keyframes show{
	0%{opacity: 0;}
	100%{opacity: 1;}
}
@keyframes show{
	0%{opacity: 0;}
	100%{opacity: 1;}
}
.show{-webkit-animation-name:show;animation-name:show;}
.revealOnScroll{opacity: 0;}



.t_ver{width:1200px;margin:0 auto;position:relative; display:none;}
.t_ver ul{position:absolute;right:0px;top:0px;z-index:9999;}
.t_ver li{float:left;margin:0px 5px;}
.t_ver a{display:block;font-size:12px;color:#333;line-height:30px;}
.t_ver a:hover{color:#207A7C;}


.t_logo{ position:absolute; top:0px; left:0px; display: flex;width: 470px;height: 74px;align-items:center;}
.t_logo img{height:70px; border:0px;}
#ea_l{display:flex;align-items:center}
.logo_wel{padding-left: 10px; margin-left: 10px; border-left: 1px dashed #d4d4d4;height:50px}
.logo_wel h3, .logo_wel p{display: block;width:330px;line-height:25px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;}
.logo_wel h3{font-size:18px;font-weight: bold;color:#207A7C;}
.logo_wel p{font-size: 16px;font-weight: normal;}

.xn_n_14_wrap{position: relative;width:1200px;margin:0 auto;}
.xn_n_14_wrap_main{width:792px;height:74px;position:absolute;right:0px;top:-74px;z-index:999;}
.xn_n_14_wrap_main>ul>li{float:left;float: left;padding: 0 20px;height:74px;position:relative;}
.yiji{}
.xn_n_14_wrap_main>ul>li>a{display: block; min-width: 64px;height: 72px;line-height: 72px;font-size: 16px;color: #333333;text-align: center;}
.yiji a.ya:hover{border-bottom:2px solid #207A7C}
.yiji .erji{display: none;}
.yiji:hover .erji{display: block;}
.xn_n_14_wrap_main>ul>li.menu_cur>a{color:#207A7C;border-bottom:2px solid #207A7C}
.xn_n_14_wrap_main>ul>li.xn_n_14_wrap_menu1_cur>a{color:#207A7C;border-bottom:2px solid #207A7C}
.xn_n_14_wrap_main>ul>li>ul{width:150px;position:absolute;left:50%;margin-left:-75px;top:74px;text-align:center;background:#fff;border:1px solid #f0f0f0;z-index:9;}
.xn_n_14_wrap_main>ul>li>ul+ul{display:none !important;}
.xn_n_14_wrap_main>ul>li>ul>li{ border-bottom:solid 1px #ededed; padding:10px 0;position:relative;}
.xn_n_14_wrap_main>ul>li>ul>li a{font-size:14px;color:#333;line-height:30px;}
.xn_n_14_wrap_main>ul>li>ul>li a:hover{color:#207A7C;}
.xn_n_14_wrap_main>ul>li>ul>li ul{position: absolute;right: -153px; background: #fff;width: 153px; top: 0;}
.xn_n_14_wrap_main>ul>li>ul>li ul li{padding:10px; border-bottom:solid 1px #ededed;}


.top{ width: 100%; z-index:99; position:relative; height:74px;border-bottom:1px solid #dddddd;background: #fff;}
.t_t{position:relative; z-index:100; width:1200px; margin:0 auto; height:74px;}
.t_curr{position:fixed; top:0;left:0;background:#fff;}



.xn_ba_banner {
    width: 100%;
    height: 450px;
    position: relative;
    background: #000;
    overflow: hidden;
    min-width: 1200px;
}
.banner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    
    height: 100%;
}
.focus {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-position: center center;
    display: none;
}
.focus img {
    display: block;
    height: 100%;
}
.logo-c {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 10;
    color: #fff;
    border-top: 1px solid transparent;
    display: none;
}
.logo-img {
    display: block;
    width: 266px;
    position: absolute;
    left: 50%;
    margin-left: -133px;
    top: 25%;
}
.slogan {
    text-align: center;
    font-size: 32px;
    top: 42%;
    position: absolute;
    width: 1000px;
    left: 50%;
    margin-left: -500px;
    color:#f6f6f6;
}
.slogan span{display:block;}
.slogan2{
	margin-top:15px;
    font-size: 12px;
    opacity:0.6;
    text-transform:uppercase;
}
.logo-c .return {
    text-align: center;
    font-size: 20px;
    top: 61%;
    position: absolute;
    width: 1000px;
    left: 50%;
    margin-left: -500px;
}
.logo-c .return a { color: #fff;}
.logo-c .language { position: absolute; width: 100%; text-align: center; font-size: 16px; color: #fff; bottom: 100px;}
.logo-c .language a { color: #fff;line-height:30px;margin:0px 5px;}
.logo-c .language a:hover { color: #207A7C;}
.langage_box{display:inline-block;padding:0px 15px;border-radius:8px;background:#605f60;}
.nav {
    text-align: center;
    font-size: 0;
    position: absolute;
    width: 1000px;
    margin-left: -500px;
    left: 50%;
    top: 60%;
}
.nav-item {
    width: 115px;
    height: 115px;
    display: inline-block;
    font-size: 14px;
    text-align: center;
    margin-right: 14px;
    color: #f6f6f6;
    background: rgba(255, 255, 255, .3);
    -o-border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}
.nav-item:last-child {
    margin-right: 0;
}
.nav-item:hover {
    background: rgba(23, 69, 146, .8);
    text-decoration: none;
}
.nav-ico {
    padding-top: 75px;
  font-size:16px;
}

.nav0 {
    background:url(img/nav0.png) no-repeat center top 20px;
}
.nav1, .nav37 {
    
    background:url(img/nav1.png) no-repeat center top 20px;
}
.nav8, .nav38 {
    
    background:url(img/nav2.png) no-repeat center top 20px;
}
.nav14, .nav39 {
    background:url(img/nav3.png) no-repeat center top 20px;
}
.nav15, .nav40 {
    background:url(img/nav4.png) no-repeat center top 20px;
}
.nav16, .nav41 {
    background:url(img/nav5.png) no-repeat center top 20px;
}
.handle {
    position: absolute;
    width: 100%;
    bottom: 48px;
    text-align: center;
    font-size: 0;
    z-index: 10;
}
.handle-item {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 9px;
    background:rgba(255,255,255,0.4);
    margin: 0 10px;
}
.handle-item:hover, .handle-item.on {
    background: #207A7C;
}

.gtitle{text-align:center;padding-top:0px;}
.gtitle .cName{display:block;font-size:26px;color:#333333;margin-bottom:5px;}
.gtitle .eName{font-size:12px;color:#999999;text-transform: uppercase;margin:0px 5px;line-height:24px;display: none;}
.gtitle .topmore{display:none;}
.gtitle .line{display:inline-block;font-size:0px;width:20px;height:1px;background:#999999;position:relative;top:-4px;display: none;}


.xn_c_index_23_wrap{ width:100%;}
.xn_c_index_23_bigbox{width:1200px;margin:0 auto;}
.xn_c_index_23_fltitle{text-align:center;padding-top:56px;}
.xn_c_index_23_cName{display:block;font-size:26px;color:#333333;margin-bottom:5px;}
.xn_c_index_23_eName{font-size:12px;color:#999999;text-transform: uppercase;margin:0px 5px;line-height:24px;}
.xn_c_index_23_topmore{display:none;}
.xn_c_index_23_line{display:inline-block;font-size:0px;width:20px;height:1px;background:#999999;position:relative;top:-4px;}
.xn_c_index_23_contbox2{display:inline-block;width:123px;height:123px;background:url(img/pro_type.png) no-repeat center center;text-align:center;line-height:123px;margin:0px 13px;opacity:0;}
.xn_c_index_23_contbox{text-align:center;margin-top:40px;}
.xn_c_index_23_contbox2 a{display:block;width:123px;height:123px;font-size:16px;color:#333333;}
.xn_c_index_23_contbox2:hover,.xn_c_index_23_contbox2.curr{background:url(img/pro_type_hover.png) no-repeat center center;}
.xn_c_index_23_contbox2:hover a,.xn_c_index_23_contbox2.curr a{color:#fff;}
.xn_c_index_23_contbox2.curr{opacity:1;}


.xn_c_index_24_wrap{ width:100%;}
.xn_c_index_24_bigbox{width:1200px;margin:0 auto;}
.xn_c_index_24_fltitle{text-align:center;padding-top:56px;}
.xn_c_index_24_cName{display:block;font-size:26px;color:#333333;margin-bottom:5px;}
.xn_c_index_24_eName{font-size:12px;color:#999999;text-transform: uppercase;margin:0px 5px;line-height:24px;}
.xn_c_index_24_topmore{display:none;}
.xn_c_index_24_line{display:inline-block;font-size:0px;width:20px;height:1px;background:#999999;position:relative;top:-4px;}
.xn_c_index_24_eName, .xn_c_index_24_line{display: none;}
.xn_c_index_24_contbox2{display:inline-block;width:123px;height:123px;background:url(img/pro_type.png) no-repeat center center;text-align:center;line-height:123px;margin:0px 13px;opacity:0;}
.xn_c_index_24_contbox{text-align:center;margin-top:40px;}
.xn_c_index_24_contbox2 a{display:block;width:123px;height:123px;font-size:16px;color:#333333;}
.xn_c_index_24_contbox2:hover,.xn_c_index_24_contbox2.curr{background:url(img/pro_type_hover.png) no-repeat center center;}
.xn_c_index_24_contbox2:hover a,.xn_c_index_24_contbox2.curr a{color:#fff;}
.xn_c_index_24_contbox2.curr{opacity:1;}


.i_tcase{width:100%;height:580px;}
.i_tcase_f{width:1200px;margin:0 auto;}
.i_tcase_t{text-align:center;padding-top:87px;}
.i_tcase_t1{display:block;font-size:26px;color:#333333;margin-bottom:5px;}
.i_tcase_t3{font-size:12px;color:#999999;text-transform: uppercase;margin:0px 5px;line-height:24px;}
.i_tcase_t2{display:inline-block;font-size:0px;width:20px;height:1px;background:#999999;position:relative;top:-4px;} 
.i_tcase_tc{font-size:14px;color:#666;line-height:24px;text-align:center;margin-top:20px;width: 780px;margin: 0 auto;}
.i_tcase_m{margin-top:40px;overflow:hidden;}
.i_tcase_main{width:190px;float:left;overflow:hidden;margin:0px 25px;}
.i_tcase_img{width:190px;height:165px;overflow:hidden; padding-left:20px; padding-top:20px;}
.i_tcase_img img{width:149px;height:149px;-webkit-transition: all .6s ease-out;
-o-transition: all .6s ease-out;
transition: all .6s ease-out;}
.i_tcase_main_name a{margin-top:10px;display:block;width:190px;font-size:18px;color:#666666;line-height:24px;font-weight:bold;text-align:center;white-space: nowrap; text-overflow:ellipsis;  -o-text-overflow:ellipsis;  overflow:hidden; -moz-binding:url('ellipsis.xml#ellipsis');}
.i_tcase_main_cnt2{display:block;width:190px;font-size:14px;color:#999999;line-height:20px;text-align:center;height:40px;overflow:hidden;margin-top:10px;}
.i_tcase_main:hover .i_tcase_main_name a{color:#207A7C;}
.i_tcase_main:hover .i_tcase_main_cnt2{color:#207A7C;}
.i_tcase_main:hover .i_tcase_img img{-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);}


.index_cnt{width:100%; background:url(img/incsp1_index_cbg.png) repeat-x; }
.index_cnt_m{width:100%; position:relative; margin:0 auto; }
.index_cnt{width:100%;  }
.index_cnt_m{width:100%; position:relative; margin:0 auto; }
.index_body{min-width: 1200px;overflow-x: hidden;}
.revealOnScroll { opacity: 0; }
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both }
.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite }
.animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s }
@-webkit-keyframes bounce { 0%, 100%, 20%, 50%, 80% {
-webkit-transform:translateY(0);
transform:translateY(0)
}
40% {
-webkit-transform:translateY(-30px);
transform:translateY(-30px)
}
60% {
-webkit-transform:translateY(-15px);
transform:translateY(-15px)
}
}
@keyframes bounce { 0%, 100%, 20%, 50%, 80% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
40% {
-webkit-transform:translateY(-30px);
-ms-transform:translateY(-30px);
transform:translateY(-30px)
}
60% {
-webkit-transform:translateY(-15px);
-ms-transform:translateY(-15px);
transform:translateY(-15px)
}
}
.bounce { -webkit-animation-name: bounce; animation-name: bounce }
@-webkit-keyframes flash { 0%, 100%, 50% {
opacity:1
}
25%, 75% {
opacity:0
}
}
@keyframes flash { 0%, 100%, 50% {
opacity:1
}
25%, 75% {
opacity:0
}
}
.flash { -webkit-animation-name: flash; animation-name: flash }
@-webkit-keyframes pulse { 0% {
-webkit-transform:scale(1);
transform:scale(1)
}
50% {
-webkit-transform:scale(1.1);
transform:scale(1.1)
}
100% {
-webkit-transform:scale(1);
transform:scale(1)
}
}
@keyframes pulse { 0% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
50% {
-webkit-transform:scale(1.1);
-ms-transform:scale(1.1);
transform:scale(1.1)
}
100% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
}
.pulse { -webkit-animation-name: pulse; animation-name: pulse }
@-webkit-keyframes rubberBand { 0% {
-webkit-transform:scale(1);
transform:scale(1)
}
30% {
-webkit-transform:scaleX(1.25) scaleY(0.75);
transform:scaleX(1.25) scaleY(0.75)
}
40% {
-webkit-transform:scaleX(0.75) scaleY(1.25);
transform:scaleX(0.75) scaleY(1.25)
}
60% {
-webkit-transform:scaleX(1.15) scaleY(0.85);
transform:scaleX(1.15) scaleY(0.85)
}
100% {
-webkit-transform:scale(1);
transform:scale(1)
}
}
@keyframes rubberBand { 0% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
30% {
-webkit-transform:scaleX(1.25) scaleY(0.75);
-ms-transform:scaleX(1.25) scaleY(0.75);
transform:scaleX(1.25) scaleY(0.75)
}
40% {
-webkit-transform:scaleX(0.75) scaleY(1.25);
-ms-transform:scaleX(0.75) scaleY(1.25);
transform:scaleX(0.75) scaleY(1.25)
}
60% {
-webkit-transform:scaleX(1.15) scaleY(0.85);
-ms-transform:scaleX(1.15) scaleY(0.85);
transform:scaleX(1.15) scaleY(0.85)
}
100% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
}
.rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand }
@-webkit-keyframes shake { 0%, 100% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translateX(-10px);
transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-webkit-transform:translateX(10px);
transform:translateX(10px)
}
}
@keyframes shake { 0%, 100% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translateX(-10px);
-ms-transform:translateX(-10px);
transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-webkit-transform:translateX(10px);
-ms-transform:translateX(10px);
transform:translateX(10px)
}
}
.shake { -webkit-animation-name: shake; animation-name: shake }
@-webkit-keyframes swing { 20% {
-webkit-transform:rotate(15deg);
transform:rotate(15deg)
}
40% {
-webkit-transform:rotate(-10deg);
transform:rotate(-10deg)
}
60% {
-webkit-transform:rotate(5deg);
transform:rotate(5deg)
}
80% {
-webkit-transform:rotate(-5deg);
transform:rotate(-5deg)
}
100% {
-webkit-transform:rotate(0deg);
transform:rotate(0deg)
}
}
@keyframes swing { 20% {
-webkit-transform:rotate(15deg);
-ms-transform:rotate(15deg);
transform:rotate(15deg)
}
40% {
-webkit-transform:rotate(-10deg);
-ms-transform:rotate(-10deg);
transform:rotate(-10deg)
}
60% {
-webkit-transform:rotate(5deg);
-ms-transform:rotate(5deg);
transform:rotate(5deg)
}
80% {
-webkit-transform:rotate(-5deg);
-ms-transform:rotate(-5deg);
transform:rotate(-5deg)
}
100% {
-webkit-transform:rotate(0deg);
-ms-transform:rotate(0deg);
transform:rotate(0deg)
}
}
.swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing }
@-webkit-keyframes tada { 0% {
-webkit-transform:scale(1);
transform:scale(1)
}
10%, 20% {
-webkit-transform:scale(0.9) rotate(-3deg);
transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale(1.1) rotate(3deg);
transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale(1.1) rotate(-3deg);
transform:scale(1.1) rotate(-3deg)
}
100% {
-webkit-transform:scale(1) rotate(0);
transform:scale(1) rotate(0)
}
}
@keyframes tada { 0% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
10%, 20% {
-webkit-transform:scale(0.9) rotate(-3deg);
-ms-transform:scale(0.9) rotate(-3deg);
transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale(1.1) rotate(3deg);
-ms-transform:scale(1.1) rotate(3deg);
transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale(1.1) rotate(-3deg);
-ms-transform:scale(1.1) rotate(-3deg);
transform:scale(1.1) rotate(-3deg)
}
100% {
-webkit-transform:scale(1) rotate(0);
-ms-transform:scale(1) rotate(0);
transform:scale(1) rotate(0)
}
}
.tada { -webkit-animation-name: tada; animation-name: tada }
@-webkit-keyframes wobble { 0% {
-webkit-transform:translateX(0%);
transform:translateX(0%)
}
15% {
-webkit-transform:translateX(-25%) rotate(-5deg);
transform:translateX(-25%) rotate(-5deg)
}
30% {
-webkit-transform:translateX(20%) rotate(3deg);
transform:translateX(20%) rotate(3deg)
}
45% {
-webkit-transform:translateX(-15%) rotate(-3deg);
transform:translateX(-15%) rotate(-3deg)
}
60% {
-webkit-transform:translateX(10%) rotate(2deg);
transform:translateX(10%) rotate(2deg)
}
75% {
-webkit-transform:translateX(-5%) rotate(-1deg);
transform:translateX(-5%) rotate(-1deg)
}
100% {
-webkit-transform:translateX(0%);
transform:translateX(0%)
}
}
@keyframes wobble { 0% {
-webkit-transform:translateX(0%);
-ms-transform:translateX(0%);
transform:translateX(0%)
}
15% {
-webkit-transform:translateX(-25%) rotate(-5deg);
-ms-transform:translateX(-25%) rotate(-5deg);
transform:translateX(-25%) rotate(-5deg)
}
30% {
-webkit-transform:translateX(20%) rotate(3deg);
-ms-transform:translateX(20%) rotate(3deg);
transform:translateX(20%) rotate(3deg)
}
45% {
-webkit-transform:translateX(-15%) rotate(-3deg);
-ms-transform:translateX(-15%) rotate(-3deg);
transform:translateX(-15%) rotate(-3deg)
}
60% {
-webkit-transform:translateX(10%) rotate(2deg);
-ms-transform:translateX(10%) rotate(2deg);
transform:translateX(10%) rotate(2deg)
}
75% {
-webkit-transform:translateX(-5%) rotate(-1deg);
-ms-transform:translateX(-5%) rotate(-1deg);
transform:translateX(-5%) rotate(-1deg)
}
100% {
-webkit-transform:translateX(0%);
-ms-transform:translateX(0%);
transform:translateX(0%)
}
}
.wobble { -webkit-animation-name: wobble; animation-name: wobble }
@-webkit-keyframes bounceIn { 0% {
opacity:0;
-webkit-transform:scale(.3);
transform:scale(.3)
}
50% {
opacity:1;
-webkit-transform:scale(1.05);
transform:scale(1.05)
}
70% {
-webkit-transform:scale(.9);
transform:scale(.9)
}
100% {
opacity:1;
-webkit-transform:scale(1);
transform:scale(1)
}
}
@keyframes bounceIn { 0% {
opacity:0;
-webkit-transform:scale(.3);
-ms-transform:scale(.3);
transform:scale(.3)
}
50% {
opacity:1;
-webkit-transform:scale(1.05);
-ms-transform:scale(1.05);
transform:scale(1.05)
}
70% {
-webkit-transform:scale(.9);
-ms-transform:scale(.9);
transform:scale(.9)
}
100% {
opacity:1;
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
}
.bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn }
@-webkit-keyframes bounceInDown { 0% {
opacity:0;
-webkit-transform:translateY(-2000px);
transform:translateY(-2000px)
}
60% {
opacity:1;
-webkit-transform:translateY(30px);
transform:translateY(30px)
}
80% {
-webkit-transform:translateY(-10px);
transform:translateY(-10px)
}
100% {
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes bounceInDown { 0% {
opacity:0;
-webkit-transform:translateY(-2000px);
-ms-transform:translateY(-2000px);
transform:translateY(-2000px)
}
60% {
opacity:1;
-webkit-transform:translateY(30px);
-ms-transform:translateY(30px);
transform:translateY(30px)
}
80% {
-webkit-transform:translateY(-10px);
-ms-transform:translateY(-10px);
transform:translateY(-10px)
}
100% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown }
@-webkit-keyframes bounceInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-2000px);
transform:translateX(-2000px)
}
60% {
opacity:1;
-webkit-transform:translateX(30px);
transform:translateX(30px)
}
80% {
-webkit-transform:translateX(-10px);
transform:translateX(-10px)
}
100% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes bounceInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-2000px);
-ms-transform:translateX(-2000px);
transform:translateX(-2000px)
}
60% {
opacity:1;
-webkit-transform:translateX(30px);
-ms-transform:translateX(30px);
transform:translateX(30px)
}
80% {
-webkit-transform:translateX(-10px);
-ms-transform:translateX(-10px);
transform:translateX(-10px)
}
100% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft }
@-webkit-keyframes bounceInRight { 0% {
opacity:0;
-webkit-transform:translateX(2000px);
transform:translateX(2000px)
}
60% {
opacity:1;
-webkit-transform:translateX(-30px);
transform:translateX(-30px)
}
80% {
-webkit-transform:translateX(10px);
transform:translateX(10px)
}
100% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes bounceInRight { 0% {
opacity:0;
-webkit-transform:translateX(2000px);
-ms-transform:translateX(2000px);
transform:translateX(2000px)
}
60% {
opacity:1;
-webkit-transform:translateX(-30px);
-ms-transform:translateX(-30px);
transform:translateX(-30px)
}
80% {
-webkit-transform:translateX(10px);
-ms-transform:translateX(10px);
transform:translateX(10px)
}
100% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight }
@-webkit-keyframes bounceInUp { 0% {
opacity:0;
-webkit-transform:translateY(2000px);
transform:translateY(2000px)
}
60% {
opacity:1;
-webkit-transform:translateY(-30px);
transform:translateY(-30px)
}
80% {
-webkit-transform:translateY(10px);
transform:translateY(10px)
}
100% {
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes bounceInUp { 0% {
opacity:0;
-webkit-transform:translateY(2000px);
-ms-transform:translateY(2000px);
transform:translateY(2000px)
}
60% {
opacity:1;
-webkit-transform:translateY(-30px);
-ms-transform:translateY(-30px);
transform:translateY(-30px)
}
80% {
-webkit-transform:translateY(10px);
-ms-transform:translateY(10px);
transform:translateY(10px)
}
100% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp }
@-webkit-keyframes bounceOut { 0% {
-webkit-transform:scale(1);
transform:scale(1)
}
25% {
-webkit-transform:scale(.95);
transform:scale(.95)
}
50% {
opacity:1;
-webkit-transform:scale(1.1);
transform:scale(1.1)
}
100% {
opacity:0;
-webkit-transform:scale(.3);
transform:scale(.3)
}
}
@keyframes bounceOut { 0% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
25% {
-webkit-transform:scale(.95);
-ms-transform:scale(.95);
transform:scale(.95)
}
50% {
opacity:1;
-webkit-transform:scale(1.1);
-ms-transform:scale(1.1);
transform:scale(1.1)
}
100% {
opacity:0;
-webkit-transform:scale(.3);
-ms-transform:scale(.3);
transform:scale(.3)
}
}
.bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut }
@-webkit-keyframes bounceOutDown { 0% {
-webkit-transform:translateY(0);
transform:translateY(0)
}
20% {
opacity:1;
-webkit-transform:translateY(-20px);
transform:translateY(-20px)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px);
transform:translateY(2000px)
}
}
@keyframes bounceOutDown { 0% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
20% {
opacity:1;
-webkit-transform:translateY(-20px);
-ms-transform:translateY(-20px);
transform:translateY(-20px)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px);
-ms-transform:translateY(2000px);
transform:translateY(2000px)
}
}
.bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown }
@-webkit-keyframes bounceOutLeft { 0% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
20% {
opacity:1;
-webkit-transform:translateX(20px);
transform:translateX(20px)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px);
transform:translateX(-2000px)
}
}
@keyframes bounceOutLeft { 0% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
20% {
opacity:1;
-webkit-transform:translateX(20px);
-ms-transform:translateX(20px);
transform:translateX(20px)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px);
-ms-transform:translateX(-2000px);
transform:translateX(-2000px)
}
}
.bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft }
@-webkit-keyframes bounceOutRight { 0% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
20% {
opacity:1;
-webkit-transform:translateX(-20px);
transform:translateX(-20px)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px);
transform:translateX(2000px)
}
}
@keyframes bounceOutRight { 0% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
20% {
opacity:1;
-webkit-transform:translateX(-20px);
-ms-transform:translateX(-20px);
transform:translateX(-20px)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px);
-ms-transform:translateX(2000px);
transform:translateX(2000px)
}
}
.bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight }
@-webkit-keyframes bounceOutUp { 0% {
-webkit-transform:translateY(0);
transform:translateY(0)
}
20% {
opacity:1;
-webkit-transform:translateY(20px);
transform:translateY(20px)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px);
transform:translateY(-2000px)
}
}
@keyframes bounceOutUp { 0% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
20% {
opacity:1;
-webkit-transform:translateY(20px);
-ms-transform:translateY(20px);
transform:translateY(20px)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px);
-ms-transform:translateY(-2000px);
transform:translateY(-2000px)
}
}
.bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp }
@-webkit-keyframes fadeIn { 0% {
opacity:0
}
100% {
opacity:1
}
}
@keyframes fadeIn { 0% {
opacity:0
}
100% {
opacity:1
}
}
.fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn }
@-webkit-keyframes fadeInDown { 0% {
opacity:0;
-webkit-transform:translateY(-20px);
transform:translateY(-20px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes fadeInDown { 0% {
opacity:0;
-webkit-transform:translateY(-20px);
-ms-transform:translateY(-20px);
transform:translateY(-20px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown }
@-webkit-keyframes fadeInDownBig { 0% {
opacity:0;
-webkit-transform:translateY(-2000px);
transform:translateY(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes fadeInDownBig { 0% {
opacity:0;
-webkit-transform:translateY(-2000px);
-ms-transform:translateY(-2000px);
transform:translateY(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig }
@-webkit-keyframes fadeInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-20px);
transform:translateX(-20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes fadeInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-20px);
-ms-transform:translateX(-20px);
transform:translateX(-20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft }
@-webkit-keyframes fadeInLeftBig { 0% {
opacity:0;
-webkit-transform:translateX(-2000px);
transform:translateX(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes fadeInLeftBig { 0% {
opacity:0;
-webkit-transform:translateX(-2000px);
-ms-transform:translateX(-2000px);
transform:translateX(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig }
@-webkit-keyframes fadeInRight { 0% {
opacity:0;
-webkit-transform:translateX(20px);
transform:translateX(20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes fadeInRight { 0% {
opacity:0;
-webkit-transform:translateX(20px);
-ms-transform:translateX(20px);
transform:translateX(20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight }
@-webkit-keyframes fadeInRightBig { 0% {
opacity:0;
-webkit-transform:translateX(2000px);
transform:translateX(2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes fadeInRightBig { 0% {
opacity:0;
-webkit-transform:translateX(2000px);
-ms-transform:translateX(2000px);
transform:translateX(2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig }
@-webkit-keyframes fadeInUp { 0% {
opacity:0;
-webkit-transform:translateY(100%);
transform:translateY(100%)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes fadeInUp { 0% {
opacity:0;
-webkit-transform:translateY(100%);
-ms-transform:translateY(100%);
transform:translateY(100%)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp }
@-webkit-keyframes fadeInUpBig { 0% {
opacity:0;
-webkit-transform:translateY(40px);
transform:translateY(40px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes fadeInUpBig { 0% {
opacity:0;
-webkit-transform:translateY(40px);
-ms-transform:translateY(40px);
transform:translateY(40px)
}
100% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig }
@-webkit-keyframes fadeOut { 0% {
opacity:1
}
100% {
opacity:0
}
}
@keyframes fadeOut { 0% {
opacity:1
}
100% {
opacity:0
}
}
.fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut }
@-webkit-keyframes fadeOutDown { 0% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(20px);
transform:translateY(20px)
}
}
@keyframes fadeOutDown { 0% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(20px);
-ms-transform:translateY(20px);
transform:translateY(20px)
}
}
.fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown }
@-webkit-keyframes fadeOutDownBig { 0% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px);
transform:translateY(2000px)
}
}
@keyframes fadeOutDownBig { 0% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px);
-ms-transform:translateY(2000px);
transform:translateY(2000px)
}
}
.fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig }
@-webkit-keyframes fadeOutLeft { 0% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-20px);
transform:translateX(-20px)
}
}
@keyframes fadeOutLeft { 0% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-20px);
-ms-transform:translateX(-20px);
transform:translateX(-20px)
}
}
.fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft }
@-webkit-keyframes fadeOutLeftBig { 0% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px);
transform:translateX(-2000px)
}
}
@keyframes fadeOutLeftBig { 0% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px);
-ms-transform:translateX(-2000px);
transform:translateX(-2000px)
}
}
.fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig }
@-webkit-keyframes fadeOutRight { 0% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(20px);
transform:translateX(20px)
}
}
@keyframes fadeOutRight { 0% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(20px);
-ms-transform:translateX(20px);
transform:translateX(20px)
}
}
.fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight }
@-webkit-keyframes fadeOutRightBig { 0% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px);
transform:translateX(2000px)
}
}
@keyframes fadeOutRightBig { 0% {
opacity:1;
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px);
-ms-transform:translateX(2000px);
transform:translateX(2000px)
}
}
.fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig }
@-webkit-keyframes fadeOutUp { 0% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-20px);
transform:translateY(-20px)
}
}
@keyframes fadeOutUp { 0% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-20px);
-ms-transform:translateY(-20px);
transform:translateY(-20px)
}
}
.fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp }
@-webkit-keyframes fadeOutUpBig { 0% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px);
transform:translateY(-2000px)
}
}
@keyframes fadeOutUpBig { 0% {
opacity:1;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px);
-ms-transform:translateY(-2000px);
transform:translateY(-2000px)
}
}
.fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig }
@-webkit-keyframes flip { 0% {
-webkit-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);
transform:perspective(400px) translateZ(0) rotateY(0) scale(1);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
40% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
50% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
80% {
-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
100% {
-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);
transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
}
@keyframes flip { 0% {
-webkit-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);
-ms-transform:perspective(400px) translateZ(0) rotateY(0) scale(1);
transform:perspective(400px) translateZ(0) rotateY(0) scale(1);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
40% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-ms-transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
transform:perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
-webkit-animation-timing-function:ease-out;
animation-timing-function:ease-out
}
50% {
-webkit-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-ms-transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
transform:perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
80% {
-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
-ms-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
transform:perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
100% {
-webkit-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-ms-transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);
transform:perspective(400px) translateZ(0) rotateY(360deg) scale(1);
-webkit-animation-timing-function:ease-in;
animation-timing-function:ease-in
}
}
.animated.flip { -webkit-backface-visibility: visible; -ms-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip }
@-webkit-keyframes flipInX { 0% {
-webkit-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateX(-10deg);
transform:perspective(400px) rotateX(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateX(10deg);
transform:perspective(400px) rotateX(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateX(0deg);
transform:perspective(400px) rotateX(0deg);
opacity:1
}
}
@keyframes flipInX { 0% {
-webkit-transform:perspective(400px) rotateX(90deg);
-ms-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateX(-10deg);
-ms-transform:perspective(400px) rotateX(-10deg);
transform:perspective(400px) rotateX(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateX(10deg);
-ms-transform:perspective(400px) rotateX(10deg);
transform:perspective(400px) rotateX(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateX(0deg);
-ms-transform:perspective(400px) rotateX(0deg);
transform:perspective(400px) rotateX(0deg);
opacity:1
}
}
.flipInX { -webkit-backface-visibility: visible!important; -ms-backface-visibility: visible!important; backface-visibility: visible!important; -webkit-animation-name: flipInX; animation-name: flipInX }
@-webkit-keyframes flipInY { 0% {
-webkit-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateY(-10deg);
transform:perspective(400px) rotateY(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateY(10deg);
transform:perspective(400px) rotateY(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateY(0deg);
transform:perspective(400px) rotateY(0deg);
opacity:1
}
}
@keyframes flipInY { 0% {
-webkit-transform:perspective(400px) rotateY(90deg);
-ms-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateY(-10deg);
-ms-transform:perspective(400px) rotateY(-10deg);
transform:perspective(400px) rotateY(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateY(10deg);
-ms-transform:perspective(400px) rotateY(10deg);
transform:perspective(400px) rotateY(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateY(0deg);
-ms-transform:perspective(400px) rotateY(0deg);
transform:perspective(400px) rotateY(0deg);
opacity:1
}
}
.flipInY { -webkit-backface-visibility: visible!important; -ms-backface-visibility: visible!important; backface-visibility: visible!important; -webkit-animation-name: flipInY; animation-name: flipInY }
@-webkit-keyframes flipOutX { 0% {
-webkit-transform:perspective(400px) rotateX(0deg);
transform:perspective(400px) rotateX(0deg);
opacity:1
}
100% {
-webkit-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
}
@keyframes flipOutX { 0% {
-webkit-transform:perspective(400px) rotateX(0deg);
-ms-transform:perspective(400px) rotateX(0deg);
transform:perspective(400px) rotateX(0deg);
opacity:1
}
100% {
-webkit-transform:perspective(400px) rotateX(90deg);
-ms-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
}
.flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible!important; -ms-backface-visibility: visible!important; backface-visibility: visible!important }
@-webkit-keyframes flipOutY { 0% {
-webkit-transform:perspective(400px) rotateY(0deg);
transform:perspective(400px) rotateY(0deg);
opacity:1
}
100% {
-webkit-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
}
@keyframes flipOutY { 0% {
-webkit-transform:perspective(400px) rotateY(0deg);
-ms-transform:perspective(400px) rotateY(0deg);
transform:perspective(400px) rotateY(0deg);
opacity:1
}
100% {
-webkit-transform:perspective(400px) rotateY(90deg);
-ms-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
}
.flipOutY { -webkit-backface-visibility: visible!important; -ms-backface-visibility: visible!important; backface-visibility: visible!important; -webkit-animation-name: flipOutY; animation-name: flipOutY }
@-webkit-keyframes lightSpeedIn { 0% {
-webkit-transform:translateX(100%) skewX(-30deg);
transform:translateX(100%) skewX(-30deg);
opacity:0
}
60% {
-webkit-transform:translateX(-20%) skewX(30deg);
transform:translateX(-20%) skewX(30deg);
opacity:1
}
80% {
-webkit-transform:translateX(0%) skewX(-15deg);
transform:translateX(0%) skewX(-15deg);
opacity:1
}
100% {
-webkit-transform:translateX(0%) skewX(0deg);
transform:translateX(0%) skewX(0deg);
opacity:1
}
}
@keyframes lightSpeedIn { 0% {
-webkit-transform:translateX(100%) skewX(-30deg);
-ms-transform:translateX(100%) skewX(-30deg);
transform:translateX(100%) skewX(-30deg);
opacity:0
}
60% {
-webkit-transform:translateX(-20%) skewX(30deg);
-ms-transform:translateX(-20%) skewX(30deg);
transform:translateX(-20%) skewX(30deg);
opacity:1
}
80% {
-webkit-transform:translateX(0%) skewX(-15deg);
-ms-transform:translateX(0%) skewX(-15deg);
transform:translateX(0%) skewX(-15deg);
opacity:1
}
100% {
-webkit-transform:translateX(0%) skewX(0deg);
-ms-transform:translateX(0%) skewX(0deg);
transform:translateX(0%) skewX(0deg);
opacity:1
}
}
.lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out }
@-webkit-keyframes lightSpeedOut { 0% {
-webkit-transform:translateX(0%) skewX(0deg);
transform:translateX(0%) skewX(0deg);
opacity:1
}
100% {
-webkit-transform:translateX(100%) skewX(-30deg);
transform:translateX(100%) skewX(-30deg);
opacity:0
}
}
@keyframes lightSpeedOut { 0% {
-webkit-transform:translateX(0%) skewX(0deg);
-ms-transform:translateX(0%) skewX(0deg);
transform:translateX(0%) skewX(0deg);
opacity:1
}
100% {
-webkit-transform:translateX(100%) skewX(-30deg);
-ms-transform:translateX(100%) skewX(-30deg);
transform:translateX(100%) skewX(-30deg);
opacity:0
}
}
.lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in }
@-webkit-keyframes rotateIn { 0% {
-webkit-transform-origin:center center;
transform-origin:center center;
-webkit-transform:rotate(-200deg);
transform:rotate(-200deg);
opacity:0
}
100% {
-webkit-transform-origin:center center;
transform-origin:center center;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
@keyframes rotateIn { 0% {
-webkit-transform-origin:center center;
-ms-transform-origin:center center;
transform-origin:center center;
-webkit-transform:rotate(-200deg);
-ms-transform:rotate(-200deg);
transform:rotate(-200deg);
opacity:0
}
100% {
-webkit-transform-origin:center center;
-ms-transform-origin:center center;
transform-origin:center center;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
.rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn }
@-webkit-keyframes rotateInDownLeft { 0% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
100% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
@keyframes rotateInDownLeft { 0% {
-webkit-transform-origin:left bottom;
-ms-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(-90deg);
-ms-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
100% {
-webkit-transform-origin:left bottom;
-ms-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
.rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft }
@-webkit-keyframes rotateInDownRight { 0% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
100% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
@keyframes rotateInDownRight { 0% {
-webkit-transform-origin:right bottom;
-ms-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(90deg);
-ms-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
100% {
-webkit-transform-origin:right bottom;
-ms-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
.rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight }
@-webkit-keyframes rotateInUpLeft { 0% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
100% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
@keyframes rotateInUpLeft { 0% {
-webkit-transform-origin:left bottom;
-ms-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(90deg);
-ms-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
100% {
-webkit-transform-origin:left bottom;
-ms-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
.rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft }
@-webkit-keyframes rotateInUpRight { 0% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
100% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
@keyframes rotateInUpRight { 0% {
-webkit-transform-origin:right bottom;
-ms-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
-ms-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
100% {
-webkit-transform-origin:right bottom;
-ms-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
}
.rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight }
@-webkit-keyframes rotateOut { 0% {
-webkit-transform-origin:center center;
transform-origin:center center;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:center center;
transform-origin:center center;
-webkit-transform:rotate(200deg);
transform:rotate(200deg);
opacity:0
}
}
@keyframes rotateOut { 0% {
-webkit-transform-origin:center center;
-ms-transform-origin:center center;
transform-origin:center center;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:center center;
-ms-transform-origin:center center;
transform-origin:center center;
-webkit-transform:rotate(200deg);
-ms-transform:rotate(200deg);
transform:rotate(200deg);
opacity:0
}
}
.rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut }
@-webkit-keyframes rotateOutDownLeft { 0% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
}
@keyframes rotateOutDownLeft { 0% {
-webkit-transform-origin:left bottom;
-ms-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:left bottom;
-ms-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(90deg);
-ms-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
}
.rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft }
@-webkit-keyframes rotateOutDownRight { 0% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
}
@keyframes rotateOutDownRight { 0% {
-webkit-transform-origin:right bottom;
-ms-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:right bottom;
-ms-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
-ms-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
}
.rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight }
@-webkit-keyframes rotateOutUpLeft { 0% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
}
@keyframes rotateOutUpLeft { 0% {
-webkit-transform-origin:left bottom;
-ms-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:left bottom;
-ms-transform-origin:left bottom;
transform-origin:left bottom;
-webkit-transform:rotate(-90deg);
-ms-transform:rotate(-90deg);
transform:rotate(-90deg);
opacity:0
}
}
.rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft }
@-webkit-keyframes rotateOutUpRight { 0% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
}
@keyframes rotateOutUpRight { 0% {
-webkit-transform-origin:right bottom;
-ms-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:right bottom;
-ms-transform-origin:right bottom;
transform-origin:right bottom;
-webkit-transform:rotate(90deg);
-ms-transform:rotate(90deg);
transform:rotate(90deg);
opacity:0
}
}
.rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight }
@-webkit-keyframes slideInDown { 0% {
opacity:0;
-webkit-transform:translateY(-2000px);
transform:translateY(-2000px)
}
100% {
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes slideInDown { 0% {
opacity:0;
-webkit-transform:translateY(-2000px);
-ms-transform:translateY(-2000px);
transform:translateY(-2000px)
}
100% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown }
@-webkit-keyframes slideInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-2000px);
transform:translateX(-2000px)
}
100% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes slideInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-2000px);
-ms-transform:translateX(-2000px);
transform:translateX(-2000px)
}
100% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft }
@-webkit-keyframes slideInRight { 0% {
opacity:0;
-webkit-transform:translateX(2000px);
transform:translateX(2000px)
}
100% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
}
@keyframes slideInRight { 0% {
opacity:0;
-webkit-transform:translateX(2000px);
-ms-transform:translateX(2000px);
transform:translateX(2000px)
}
100% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
}
.slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight }
@-webkit-keyframes slideOutLeft { 0% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px);
transform:translateX(-2000px)
}
}
@keyframes slideOutLeft { 0% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px);
-ms-transform:translateX(-2000px);
transform:translateX(-2000px)
}
}
.slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft }
@-webkit-keyframes slideOutRight { 0% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px);
transform:translateX(2000px)
}
}
@keyframes slideOutRight { 0% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px);
-ms-transform:translateX(2000px);
transform:translateX(2000px)
}
}
.slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight }
@-webkit-keyframes slideOutUp { 0% {
-webkit-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px);
transform:translateY(-2000px)
}
}
@keyframes slideOutUp { 0% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px);
-ms-transform:translateY(-2000px);
transform:translateY(-2000px)
}
}
.slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp }
@-webkit-keyframes slideInUp { 0% {
-webkit-transform:translateY(2000px);
transform:translateY(2000px)
}
100% {
opacity:0;
-webkit-transform:translateY(0);
transform:translateY(0)
}
}
@keyframes slideInUp { 0% {
-webkit-transform:translateY(2000px);
-ms-transform:translateY(2000px);
transform:translateY(2000px)
}
100% {
opacity:0;
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
}
.slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp }
@-webkit-keyframes slideOutDown { 0% {
-webkit-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px);
transform:translateY(2000px)
}
}
@keyframes slideOutDown { 0% {
-webkit-transform:translateY(0);
-ms-transform:translateY(0);
transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px);
-ms-transform:translateY(2000px);
transform:translateY(2000px)
}
}
.slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown }
@-webkit-keyframes hinge { 0% {
-webkit-transform:rotate(0);
transform:rotate(0);
-webkit-transform-origin:top left;
transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out
}
20%, 60% {
-webkit-transform:rotate(80deg);
transform:rotate(80deg);
-webkit-transform-origin:top left;
transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out
}
40% {
-webkit-transform:rotate(60deg);
transform:rotate(60deg);
-webkit-transform-origin:top left;
transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out
}
80% {
-webkit-transform:rotate(60deg) translateY(0);
transform:rotate(60deg) translateY(0);
-webkit-transform-origin:top left;
transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out;
opacity:1
}
100% {
-webkit-transform:translateY(700px);
transform:translateY(700px);
opacity:0
}
}
@keyframes hinge { 0% {
-webkit-transform:rotate(0);
-ms-transform:rotate(0);
transform:rotate(0);
-webkit-transform-origin:top left;
-ms-transform-origin:top left;
transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out
}
20%, 60% {
-webkit-transform:rotate(80deg);
-ms-transform:rotate(80deg);
transform:rotate(80deg);
-webkit-transform-origin:top left;
-ms-transform-origin:top left;
transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out
}
40% {
-webkit-transform:rotate(60deg);
-ms-transform:rotate(60deg);
transform:rotate(60deg);
-webkit-transform-origin:top left;
-ms-transform-origin:top left;
transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out
}
80% {
-webkit-transform:rotate(60deg) translateY(0);
-ms-transform:rotate(60deg) translateY(0);
transform:rotate(60deg) translateY(0);
-webkit-transform-origin:top left;
-ms-transform-origin:top left;
transform-origin:top left;
-webkit-animation-timing-function:ease-in-out;
animation-timing-function:ease-in-out;
opacity:1
}
100% {
-webkit-transform:translateY(700px);
-ms-transform:translateY(700px);
transform:translateY(700px);
opacity:0
}
}
.hinge { -webkit-animation-name: hinge; animation-name: hinge }
@-webkit-keyframes rollIn { 0% {
opacity:0;
-webkit-transform:translateX(-100%) rotate(-120deg);
transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
-webkit-transform:translateX(0px) rotate(0deg);
transform:translateX(0px) rotate(0deg)
}
}
@keyframes rollIn { 0% {
opacity:0;
-webkit-transform:translateX(-100%) rotate(-120deg);
-ms-transform:translateX(-100%) rotate(-120deg);
transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
-webkit-transform:translateX(0px) rotate(0deg);
-ms-transform:translateX(0px) rotate(0deg);
transform:translateX(0px) rotate(0deg)
}
}
.rollIn { -webkit-animation-name: rollIn; animation-name: rollIn }
@-webkit-keyframes rollOut { 0% {
opacity:1;
-webkit-transform:translateX(0px) rotate(0deg);
transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
-webkit-transform:translateX(100%) rotate(120deg);
transform:translateX(100%) rotate(120deg)
}
}
@keyframes rollOut { 0% {
opacity:1;
-webkit-transform:translateX(0px) rotate(0deg);
-ms-transform:translateX(0px) rotate(0deg);
transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
-webkit-transform:translateX(100%) rotate(120deg);
-ms-transform:translateX(100%) rotate(120deg);
transform:translateX(100%) rotate(120deg)
}
}
.rollOut { -webkit-animation-name: rollOut; animation-name: rollOut }
.revealOnScroll { opacity: 0; }
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; }
.animated.maxtime { -webkit-animation-duration: 2s; animation-duration: 2s; }
@-webkit-keyframes fadeInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-100%);
transform:translateX(-100%);
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0);
}
}
@keyframes fadeInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-100%);
transform:translateX(-100%);
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0);
}
}
.fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; }
@-webkit-keyframes fadeInLeftBig { 0% {
opacity:0;
-webkit-transform:translateX(-200%);
transform:translateX(-200%);
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0);
}
}
@keyframes fadeInLeftBig { 0% {
opacity:0;
-webkit-transform:translateX(-200%);
transform:translateX(-200%);
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0);
}
}
.fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; }
@-webkit-keyframes fadeInRight { 0% {
opacity:0;
-webkit-transform:translateX(100%);
transform:translateX(100%);
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0);
}
}
@keyframes fadeInRight { 0% {
opacity:0;
-webkit-transform:translateX(100%);
transform:translateX(100%);
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0);
}
}
.fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; }
@-webkit-keyframes fadeInRightBig { 0% {
opacity:0;
-webkit-transform:translateX(200%);
transform:translateX(200%);
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0);
}
}
@keyframes fadeInRightBig { 0% {
opacity:0;
-webkit-transform:translateX(200%);
transform:translateX(200%);
}
100% {
opacity:1;
-webkit-transform:translateX(0);
transform:translateX(0);
}
}
.fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; }
@-webkit-keyframes fadeInTop { 0% {
opacity:0;
-webkit-transform:translateY(-100%);
transform:translateY(-100%);
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0);
}
}
@keyframes fadeInTop { 0% {
opacity:0;
-webkit-transform:translateY(-100%);
transform:translateY(-100%);
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0);
}
}
.fadeInTop { -webkit-animation-name: fadeInTop; animation-name: fadeInTop; }
@-webkit-keyframes fadeInTopBig { 0% {
opacity:0;
-webkit-transform:translateY(-200%);
transform:translateY(-200%);
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0);
}
}
@keyframes fadeInTopBig { 0% {
opacity:0;
-webkit-transform:translateY(-200%);
transform:translateY(-200%);
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0);
}
}
.fadeInTopBig { -webkit-animation-name: fadeInTopBig; animation-name: fadeInTopBig; }
@-webkit-keyframes fadeInBottom { 0% {
opacity:0;
-webkit-transform:translateY(100%);
transform:translateY(100%);
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0);
}
}
@keyframes fadeInBottom { 0% {
opacity:0;
-webkit-transform:translateY(100%);
transform:translateY(100%);
}
100% {
opacity:1;
-webkit-transform:translateY(0);
transform:translateY(0);
}
}
.fadeInBottom { -webkit-animation-name: fadeInBottom; animation-name: fadeInBottom; }
@-webkit-keyframes shake { 0%, 100% {
-webkit-transform:translateX(0);
transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translateX(-10px);
transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-webkit-transform:translateX(10px);
transform:translateX(10px)
}
}
@keyframes shake { 0%, 100% {
-webkit-transform:translateX(0);
-ms-transform:translateX(0);
transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translateX(-10px);
-ms-transform:translateX(-10px);
transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-webkit-transform:translateX(10px);
-ms-transform:translateX(10px);
transform:translateX(10px)
}
}
.shake { opacity: 1; -webkit-animation-name: shake; animation-name: shake }
@-webkit-keyframes swing { 20% {
-webkit-transform:rotate(15deg);
transform:rotate(15deg)
}
40% {
-webkit-transform:rotate(-10deg);
transform:rotate(-10deg)
}
60% {
-webkit-transform:rotate(5deg);
transform:rotate(5deg)
}
80% {
-webkit-transform:rotate(-5deg);
transform:rotate(-5deg)
}
100% {
-webkit-transform:rotate(0deg);
transform:rotate(0deg)
}
}
@keyframes swing { 20% {
-webkit-transform:rotate(15deg);
-ms-transform:rotate(15deg);
transform:rotate(15deg)
}
40% {
-webkit-transform:rotate(-10deg);
-ms-transform:rotate(-10deg);
transform:rotate(-10deg)
}
60% {
-webkit-transform:rotate(5deg);
-ms-transform:rotate(5deg);
transform:rotate(5deg)
}
80% {
-webkit-transform:rotate(-5deg);
-ms-transform:rotate(-5deg);
transform:rotate(-5deg)
}
100% {
-webkit-transform:rotate(0deg);
-ms-transform:rotate(0deg);
transform:rotate(0deg)
}
}
.swing { opacity: 1; -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing }
@-webkit-keyframes tada { 0% {
-webkit-transform:scale(1);
transform:scale(1)
}
10%, 20% {
-webkit-transform:scale(0.9) rotate(-3deg);
transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale(1.1) rotate(3deg);
transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale(1.1) rotate(-3deg);
transform:scale(1.1) rotate(-3deg)
}
100% {
-webkit-transform:scale(1) rotate(0);
transform:scale(1) rotate(0)
}
}
@keyframes tada { 0% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
10%, 20% {
-webkit-transform:scale(0.9) rotate(-3deg);
-ms-transform:scale(0.9) rotate(-3deg);
transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale(1.1) rotate(3deg);
-ms-transform:scale(1.1) rotate(3deg);
transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale(1.1) rotate(-3deg);
-ms-transform:scale(1.1) rotate(-3deg);
transform:scale(1.1) rotate(-3deg)
}
100% {
-webkit-transform:scale(1) rotate(0);
-ms-transform:scale(1) rotate(0);
transform:scale(1) rotate(0)
}
}
. {
opacity:1;
-webkit-animation-name:tada;
animation-name:tada
}
@keyframes fadeMoveLeft { from {
margin-left:3px;
}
to { margin-left: -6px; }
}
@-moz-keyframes fadeMoveLeft { from {
margin-left:3px;
}
to { margin-left: -6px; }
}
@-webkit-keyframes fadeMoveLeft { from {
margin-left:3px;
}
to { margin-left: -6px; }
}
.fadeMoveLeft { animation: fadeMoveLeft 0.5s infinite; -moz-animation: fadeMoveLeft 0.5s infinite; -webkit-animation: fadeMoveLeft 0.5s infinite; }
@keyframes fadeMoveRight { from {
margin-left:-3px;
}
to { margin-left: 6px; }
}
@-moz-keyframes fadeMoveRight { from {
margin-left:-3px;
}
to { margin-left: 6px; }
}
@-webkit-keyframes fadeMoveRight { from {
margin-left:-3px;
}
to { margin-left: 6px; }
}
.fadeMoveRight { animation: fadeMoveRight 0.5s infinite; -moz-animation: fadeMoveRight 0.5s infinite; -webkit-animation: fadeMoveRight 0.5s infinite; }
@-webkit-keyframes lightSpeedIn { 0% {
-webkit-transform:translateX(100%) skewX(-30deg);
transform:translateX(100%) skewX(-30deg);
opacity:0
}
60% {
-webkit-transform:translateX(-20%) skewX(30deg);
transform:translateX(-20%) skewX(30deg);
opacity:1
}
80% {
-webkit-transform:translateX(0%) skewX(-15deg);
transform:translateX(0%) skewX(-15deg);
opacity:1
}
100% {
-webkit-transform:translateX(0%) skewX(0deg);
transform:translateX(0%) skewX(0deg);
opacity:1
}
}
@keyframes lightSpeedIn { 0% {
-webkit-transform:translateX(100%) skewX(-30deg);
-ms-transform:translateX(100%) skewX(-30deg);
transform:translateX(100%) skewX(-30deg);
opacity:0
}
60% {
-webkit-transform:translateX(-20%) skewX(30deg);
-ms-transform:translateX(-20%) skewX(30deg);
transform:translateX(-20%) skewX(30deg);
opacity:1
}
80% {
-webkit-transform:translateX(0%) skewX(-15deg);
-ms-transform:translateX(0%) skewX(-15deg);
transform:translateX(0%) skewX(-15deg);
opacity:1
}
100% {
-webkit-transform:translateX(0%) skewX(0deg);
-ms-transform:translateX(0%) skewX(0deg);
transform:translateX(0%) skewX(0deg);
opacity:1
}
}
.lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out }
@-webkit-keyframes flipInY { 0% {
-webkit-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateY(-10deg);
transform:perspective(400px) rotateY(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateY(10deg);
transform:perspective(400px) rotateY(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateY(0deg);
transform:perspective(400px) rotateY(0deg);
opacity:1
}
}
@keyframes flipInY { 0% {
-webkit-transform:perspective(400px) rotateY(90deg);
-ms-transform:perspective(400px) rotateY(90deg);
transform:perspective(400px) rotateY(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateY(-180deg);
-ms-transform:perspective(400px) rotateY(-180deg);
transform:perspective(400px) rotateY(-180deg)
}
70% {
-webkit-transform:perspective(400px) rotateY(180deg);
-ms-transform:perspective(400px) rotateY(180deg);
transform:perspective(400px) rotateY(180deg)
}
100% {
-webkit-transform:perspective(400px) rotateY(0deg);
-ms-transform:perspective(400px) rotateY(0deg);
transform:perspective(400px) rotateY(0deg);
opacity:1
}
}
.flipInY { -webkit-backface-visibility: visible!important; -ms-backface-visibility: visible!important; backface-visibility: visible!important; -webkit-animation-name: flipInY; animation-name: flipInY }
@-webkit-keyframes flipInX { 0% {
-webkit-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateX(-10deg);
transform:perspective(400px) rotateX(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateX(10deg);
transform:perspective(400px) rotateX(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateX(0deg);
transform:perspective(400px) rotateX(0deg);
opacity:1
}
}
@keyframes flipInX { 0% {
-webkit-transform:perspective(400px) rotateX(90deg);
-ms-transform:perspective(400px) rotateX(90deg);
transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateX(-10deg);
-ms-transform:perspective(400px) rotateX(-10deg);
transform:perspective(400px) rotateX(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateX(10deg);
-ms-transform:perspective(400px) rotateX(10deg);
transform:perspective(400px) rotateX(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateX(0deg);
-ms-transform:perspective(400px) rotateX(0deg);
transform:perspective(400px) rotateX(0deg);
opacity:1
}
}
.flipInX { -webkit-backface-visibility: visible!important; -ms-backface-visibility: visible!important; backface-visibility: visible!important; -webkit-animation-name: flipInX; animation-name: flipInX }
@-webkit-keyframes pulse { 0% {
-webkit-transform:scale(0);
transform:scale(0)
}
100% {
-webkit-transform:scale(1);
transform:scale(1)
}
}
@keyframes pulse { 0% {
-webkit-transform:scale(0);
-ms-transform:scale(0);
transform:scale(0)
}
100% {
-webkit-transform:scale(1);
-ms-transform:scale(1);
transform:scale(1)
}
}
.pulse { -webkit-animation-name: pulse; animation-name: pulse }
@-webkit-keyframes show { 0% {
opacity: 0;
}
 100% {
opacity: 1;
}
}
@keyframes show { 0% {
opacity: 0;
}
 100% {
opacity: 1;
}
}
.show { -webkit-animation-name: show; animation-name: show; }


.xn_c_index_23_2_wrap{width:100%;height:510px;background:#f5f5f5;margin-top:65px;}
.xn_c_index_23_2_wbox{width:1200px;height:510px;margin:0 auto;position:relative;}
.xn_c_index_23_2_scroll{width:1200px;height:510px;overflow:hidden;}
.xn_c_index_23_2_cLi{width:1200px;height:510px;float:left;}
.xn_c_index_23_2_cLi_cbox_left{width:510px;height:510px;float:left;overflow:hidden;}
.xn_c_index_23_2_cLi_cbox_left img{width:510px;height:510px;-webkit-transition: all .6s ease-out;
-o-transition: all .6s ease-out;
transition: all .6s ease-out;}
.xn_c_index_23_2_cLi_cbox_right{width:600px;height:510px;float:right;}
.xn_c_index_23_2_cLi_cbox_con{padding-top:110px;}
.xn_c_index_23_2_cLi_title a{font-size:26px;color:#333333;}
.xn_c_index_23_2_cLi_title a:hover{color:#207A7C;}
.xn_c_index_23_2_cLi_c{font-size:14px;color:#666;line-height:24px;width:600px;height:120px;overflow:hidden;margin-top:10px;}
.xn_c_index_23_2_cMain_li{width:134px;height:116px;overflow:hidden;background:#fff;float:left;margin-right:6px;}
.xn_c_index_23_2_cMain_li img{width:134px;height:83px;margin-top: 18px;-webkit-transition: all .6s ease-out;
-o-transition: all .6s ease-out;
transition: all .6s ease-out;}
.xn_c_index_23_2_cMain_li:hover img{-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);}
.xn_c_index_23_2_cLi_clist_more{float:left;width:134px;height:116px;overflow:hidden;background:#207A7C;}
.xn_c_index_23_2_cLi_clist_more a{display:block;float:left;width:134px;padding-top:76px;height:40px;font-size:14px;color:#fff;text-align:center;background:url(img/prod_more.png) no-repeat center top 25px;}
.xn_c_index_23_2_cLi_left{width:100px;height:100px;background:url(img/products_left.png) no-repeat center center;position:absolute;left:-100px;top:205px;background-size:100%;cursor:pointer;}
.xn_c_index_23_2_cLi_right{width:100px;height:100px;background:url(img/products_right.png) no-repeat center center;position:absolute;right:-100px;top:205px;background-size:100%;cursor:pointer;}
.xn_c_index_23_2_cul{position:relative;}
.xn_c_index_23_2_cLi_left:hover,.xn_c_index_23_2_cLi_right:hover{opacity:0.7;}

.xn_c_index_23_2_cLi_cbox_left:hover img{-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);}


.xn_c_index_24_2_wrap{width:100%;height:410px;background:#f5f5f5;margin-top:65px;}
.xn_c_index_24_2_wbox{width:1200px;height:410px;margin:0 auto;position:relative;}
.xn_c_index_24_2_scroll{width:1200px;height:410px;overflow:hidden;}
.xn_c_index_24_2_cLi{width:1200px;height:410px;float:left;}
.xn_c_index_24_2_cLi_cbox_left{width:410px;height:410px;float:left;overflow:hidden;}
.xn_c_index_24_2_cLi_cbox_left img{width:410px;height:410px;-webkit-transition: all .6s ease-out;
-o-transition: all .6s ease-out;
transition: all .6s ease-out;}
.xn_c_index_24_2_cLi_cbox_right{width:700px;height:410px;float:right;}
.xn_c_index_24_2_cLi_cbox_con{padding-top:70px;}
.xn_c_index_24_2_cLi_title a{font-size:26px;color:#333333;}
.xn_c_index_24_2_cLi_title a:hover{color:#207A7C;}
.xn_c_index_24_2_cLi_c{font-size:14px;color:#666;line-height:24px;width:700px;height:96px;overflow:hidden;margin-top:10px;}
.xn_c_index_24_2_cMain_li{width:180px;height:150px;overflow:hidden;background:#fff;float:left;margin-right:6px;}
.xn_c_index_24_2_cMain_li img{width:180px;height:120px; margin-top:18px;-webkit-transition: all .6s ease-out;
-o-transition: all .6s ease-out;
transition: all .6s ease-out;}
.xn_c_index_24_2_cMain_li:hover img{-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);}
.xn_c_index_24_2_cLi_clist_more{float:left;width:140px;height:150px;overflow:hidden;background:#207A7C;}
.xn_c_index_24_2_cLi_clist_more a{display:block;float:left;width:140px;padding-top:96px;height:40px;font-size:14px;color:#fff;text-align:center;background:url(img/prod_more.png) no-repeat center 40px;}
.xn_c_index_24_2_cLi_left{width:100px;height:100px;background:url(img/products_left.png) no-repeat center center;position:absolute;left:-100px;top:155px;background-size:100%;cursor:pointer;}
.xn_c_index_24_2_cLi_right{width:100px;height:100px;background:url(img/products_right.png) no-repeat center center;position:absolute;right:-100px;top:155px;background-size:100%;cursor:pointer;}
.xn_c_index_24_2_cul{position:relative;}
.xn_c_index_24_2_cLi_left:hover,.xn_c_index_24_2_cLi_right:hover{opacity:0.7;}

.xn_c_index_24_2_cLi_cbox_left:hover img{-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);}


.xn_c_index_about{width: 100%;background:#ffffff;padding-bottom: 70px;}
.xn_c_index_about_box{width: 1200px;margin: 0 auto;}
.xn_c_index_about_top{width: 100%;line-height: 40px;text-align: center;color: #333;font-weight: bold; font-size: 26px; padding-top: 70px;}
.xn_c_index_about_line{display:block;width:30px;height:2px;background:#333;margin:0 auto;margin-top:5px;}
.xn_c_index_about_con{line-height: 30px;text-align: center; color: #666;font-size: 14px;margin-top:50px;}
.xn_c_index_about_shu{text-align: center;margin-top: 20px;}
.xn_c_index_about_shu li{width: 225px; display: inline-block; *display: inline; *zoom:1; text-align: center;}
.xn_c_index_about_shu li:first-child{background: no-repeat;}
#xn_c_index_about_shut{width: 100%;height: 50px;line-height: 50px; font-size: 38px;color: #333333;font-family: "[HYk1gj]";}
#xn_c_index_about_shut a{font-size:40px;font-weight:bold;color: #333333;font-family: "微软雅黑";}
#xn_c_index_about_shub{width: 100%;height: 32px;line-height: 32px;font-size: 18px;color: #333;margin-top:12px;}
.xn_c_index_about_more{width: 149px;height: 41px; margin: 55px auto 0;}
.xn_c_index_about_more a{display: block;width: 136px;height: 43px; text-align: center;color: #666;font-size: 14px; line-height: 43px;border: 1px solid #666;
      -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
}
.xn_c_index_about_more a:hover{
    background:#207A7C;
    color:#fff;
  cursor: pointer;
  -webkit-animation-name: hvr-wobble-vertical;
  animation-name: hvr-wobble-vertical;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
@-webkit-keyframes hvr-wobble-vertical {
  16.65% {
    -webkit-transform: translateZ(8px);
    transform: translateZ(8px);
  }
  33.3% {
    -webkit-transform: translateZ(-6px);
    transform: translateZ(-6px);
  }
  49.95% {
    -webkit-transform: translateZ(4px);
    transform: translateZ(4px);
  }
  66.6% {
    -webkit-transform: translateZ(-2px);
    transform: translateZ(-2px);
  }
  83.25% {
    -webkit-transform: translateZ(1px);
    transform: translateZ(1px);
  }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}
@keyframes hvr-wobble-vertical {
  16.65% {
    -webkit-transform: translateZ(8px);
    transform: translateZ(8px);
  }
  33.3% {
    -webkit-transform: translateZ(-6px);
    transform: translateZ(-6px);
  }
  49.95% {
    -webkit-transform: translateZ(4px);
    transform: translateZ(4px);
  }
  66.6% {
    -webkit-transform: translateZ(-2px);
    transform: translateZ(-2px);
  }
  83.25% {
    -webkit-transform: translateZ(1px);
    transform: translateZ(1px);
  }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
}
#xn_c_index_about_shut:hover{
    cursor: pointer;
  -webkit-animation-name: hvr-wobble-vertical;
  animation-name: hvr-wobble-vertical;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
@-webkit-keyframes hvr-wobble-vertical {
  16.65% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  33.3% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes hvr-wobble-vertical {
  16.65% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  33.3% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}


.xn_c_index_sv_t{text-align:center;padding-top:65px;}
.xn_c_index_sv_t1{display:block;font-size:26px;color:#333333;margin-bottom:5px;}
.xn_c_index_sv_t3{font-size:12px;color:#999999;text-transform: uppercase;margin:0px 5px;line-height:24px;}
.xn_c_index_sv_t2{display:inline-block;font-size:0px;width:20px;height:1px;background:#999999;position:relative;top:-4px;} 
.xn_c_index_sv_t3, .xn_c_index_sv_t2{display: none;}
.xn_c_index_sv_tc{font-size:14px;color:#666;line-height:24px;text-align:center;margin-top:20px;}
.xn_c_index_sv_m{width:1200px;margin:0 auto;margin-top:70px;overflow:hidden;}
.xn_c_index_sv_left{width:875px;height:575px;float:left;}
.xn_c_index_sv_right{display: flex;justify-content: space-around;align-items: center;animation: fadeInRight 0.5s;}
        .xn_c_index_sv_ul {
            list-style: none;
            padding: 0;
            margin: 0;
            display: flex;
        }



.xn_c_index_sv_limg{width:84px;height:84px;padding:3px;background:#fff;float:left;border-radius:50%;}
.xn_c_index_sv_li{margin: 0 10px;text-align: center;width:215px;height:105px;background:#f2f2f2;border-radius:45px;overflow:hidden;margin-bottom:50px;}

        .xn_c_index_sv_limg img {
            width: 100px;
            height: auto;
        }

        @keyframes fadeInRight {
            from {
                opacity: 0;
                transform: translateX(100%);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

.xn_c_index_sv_lc{width:100px;float:left;margin-left:20px;}
.xn_c_index_sv_lc_name{font-size:16px;color:#333;line-height:25px;margin-top:34px;}
.xn_c_index_sv_lc_c{font-size:12px;color:#999;margin-top:3px;}


.xn_c_index_news{width: 100%;background: #fff;}
.xn_c_index_news_top{text-align:center;padding-top:65px;}
.xn_c_index_news_top1{display:block;font-size:26px;color:#333333;margin-bottom:5px;}
.xn_c_index_news_top2{font-size:12px;color:#999999;text-transform: uppercase;margin:0px 5px;line-height:24px;}
.xn_c_index_news_line{display:inline-block;font-size:0px;width:20px;height:1px;background:#999999;position:relative;top:-4px;} 
.xn_c_index_news_top2, .xn_c_index_news_line{display: none;}

.xn_c_index_357_wrap{width:1200px;height:auto;margin: 48px auto 0;overflow:hidden; height: 336px; position: relative;}
.xn_c_index_357_main{height:auto;overflow:hidden;position:relative;}
.xn_c_index_357_inner{height:336px;overflow:hidden;position:relative;}
.xn_c_index_357_inner ul{height:336px;overflow:hidden;position:relative;}
.xn_c_index_357_inner li{width:100%;height:336px;float:left;overflow:hidden;position:absolute;left:0;top:0;cursor:pointer;opacity:0;z-index:22;}
.xn_c_index_357_img{width:432px;height:288px;overflow:hidden; position: absolute;left: 42px;top: 0;z-index: 10;}
.xn_c_index_357_img img{width:100%;height:100%;display:block;border:0;}
.xn_c_index_357_conbox{width: 1200px;height: 291px;background: #eeeeee; margin-top: 45px;}
.xn_c_index_357_conboxc{width: 643px; float: right; margin-right: 40px;}
.xn_c_index_357_conboxc>*{box-sizing: content-box;}
.xn_c_index_357_tmname{display: none !important;}
.xn_c_index_357_inner .xn_c_index_357_ft{width:100%;height:30px;overflow:hidden;position:absolute;left:0;bottom:0;z-index:33;}
.xn_c_index_357_inner .xn_c_index_357_title{height:40px;line-height:40px;overflow:hidden;padding-top: 27px; text-align:left;}
.xn_c_index_357_title a{font-size:20px;color:#333333;}
.xn_c_index_357_title a:hover{color: #207A7C}
.xn_c_index_357_Date{height: 20px;line-height: 20px;padding-left: 563px;width: 92px; background: url(img/xn_c_index_357_date.png) left  no-repeat;}
.xn_c_index_357_Date>span{display: block;float: left;color: #a0a0a0;font-size: 12px;}
.xn_c_index_357_intro{height:104px;line-height: 26px;margin-top: 6px;color: #333333;font-size: 14px; overflow: hidden;}
.xn_c_index_357_nums{height:11px;overflow:hidden;text-align:center; position: absolute; top: 307px;z-index: 30; position: absolute;left: 230px;}
.xn_c_index_357_nums span{width:9px;height:9px;display:inline-block;border: 1px solid #207A7C; border-radius: 50%; margin-right:13px;cursor:pointer;}
.xn_c_index_357_nums span.curr,.xn_c_index_357_nums span:hover{background:#207A7C !important;border: 1px solid #207A7C;}
.xn_c_index_357_prev,.xn_c_index_357_next{display:none;}
.xn_c_index_357_more{width: 149px;height: 41px;margin-top: 36px;float: right;}
.xn_c_index_357_more a:hover{border: 1px solid #fff; color: #fff;  background: #207A7C;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}
.xn_c_index_357_more a{width: 147px;height: 39px;text-align: center;line-height: 39px; font-size: 14px;display: block;border: 1px solid #207A7C; color: #207A7C;background: none;}


.xn_c_index_39_wrap{width:1200px;margin:10px auto 0px; overflow: hidden;padding-bottom:20px;}
.xn_c_index_39_topbox{width:100%;line-height:30px;}
.xn_c_index_39_newsmore{float:right;}
.xn_c_index_39_nrbox{width:100%;}
.xn_c_index_39_nrboxsmall{float: left;width: 588px;height: 125px; margin-left: 24px; margin-bottom: 34px;background:#eeeeee;}
.xn_c_index_39_nrboxsmall0{margin-left: 0 !important;}
.xn_c_index_39_nrboxsmall2{margin-left: 0 !important;}
.xn_c_index_39_lftbox{float:left;width:146px; height: 103px;position: relative;padding:10px 0px;padding-left:12px;}
.xn_c_index_39_img{width:146px; height: 103px;}
.xn_c_index_39_lftbox img{width:146px; height: 103px;}
.xn_c_index_39_ritbox{float:right;width:420px; height: 123px;background: #eeeeee;}
.xn_c_index_39_nrboxsmall:hover .xn_c_index_39_ritbox{background:none;border-top:1px solid #eeeeee;border-bottom: 1px solid #eeeeee}
.xn_c_index_39_title{width:345px;margin-left: 13px; margin-top: 6px; height: 30px;line-height: 30px;overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;}
.xn_c_index_39_title a{color: #333333;font-size: 14px;display: block;width: 345px;overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}
.xn_c_index_39_title a:hover{color: #207A7C;}
.xn_c_index_39_click,.xn_c_index_39_more{display: none;}
.xn_c_index_39_coent{width:345px; height:44px;line-height:22px;overflow:hidden;margin-left: 13px; font-size: 12px;color:#999999;margin-top:15px;}
.xn_c_index_39_time{margin-left: 13px;font-size:12px;color:#999999;}



.xn_f_21_wrap{width:1020px;float:left;font-size:14px;color:#dddddd;margin-top:5px;display:none;}
.xn_f_21_xhbox{float:left;font-size:14px;color:#dddddd;margin-right:10px;}
.index_body .xn_f_21_wrap{display: block;}
.foot .xn_f_21_xhbox a{font-size:14px;color:#dddddd;}
.foot .xn_f_21_xhbox a:hover{color:#fff;text-decoration:underline;}


.foot_copy{width:1020px;float:left;font-size: 14px;color: #ddd;line-height: 24px;opacity: 0.34;margin-top:10px;}
.foot .foot_copy_ba a{font-size:14px;color: #ddd;line-height: 24px;}
.foot .foot_copy_ba a:hover{color:#fff;opacity: 1 !important;}


.xn_f_2_warp {width:1020px;float:left;margin-top:5px;}


.foot{  width:100%; position:relative; text-align:center; font-size:12px;color:#666666; line-height:25px; background:#333333;padding:30px 0px 10px 0;}
.foot a{ font-size:12px; color:#666666; text-decoration:none; line-height:25px;}
.foot a:hover{}
.foot_c{position:relative; width:1200px; margin:auto; text-align:left;overflow:hidden; height:132px;}


.xn_f_company{width:1020px;float:left;font-size:20px;color:#dddddd;font-weight:bold;}


.xn_f_ewm{width:105px;float:right;position:absolute;right:10px;top:0px;}
.xn_f_ewm img{width:105px;height:105px;margin-bottom:5px;}
.xn_f_ewm_text{font-size:14px;color:#ffffff;text-align:center;}




.index_body{}


.about_body,.case_body,.case_view_body,.clients_body,.contact_body,.down_body,.down_view_body,.feedback_body,.faq_body,.faq_view_body,.honor_body,.honor_client_list_body,.honor_client_view_body,.job_body,.job_online_body,.news_body,.news_view_body,.order_body,.pro_body,.pro2_body,.prod_view_body,.products_body,.products2_body,.recruitment_body,.search_body,.sv_body,.video_body,.video_view_body,.sitemap_body,.clapro_complex_body,.claproducts_body,.claprod_view_body,.login_body,.reg_body,.success_body,.member_body,.getpass_body,.getchapass_body,.changepass_body,.lose_body,.verifymail_body,.apply_body,.buysucces_body,.callback_body,.help_body,.mborlist_body,.mborlist_view_body,.orlogin_body,.spcartone_body,.spcartthree_body,.spcarttwo_body{}




.close{background:url(img/cgagffpneaoakiegaaaenocwtpc874.png) center no-repeat;width: 68px;height: 20px;font-size:0;position:absolute;top: -5px;border-radius: 8px;right: 2px;cursor:pointer;margin:0 !important;z-index:999;}
.xn_m_2_wrap{top:-50px;}
.xn_m_2_head{width:70px;height: 20px;color:#fff;}
.xn_m_2_wrap{position:fixed;height:auto;width: 70px;z-index: 99; top:230px!important; right:3%!important; -webkit-transform: translateY(50%);
   -moz-transform: translateY(50%);
    -ms-transform: translateY(50%);
     -o-transform: translateY(50%);
        transform: translateY(50%);display: none;}
.xn_m_2_mbox img{ display: none;   width: 100px;clear: both; height: 100px; position: absolute;    margin-left: -101px;
    margin-top: -1px;}
.xn_m_2_tel_box{opacity: 0;}
.xn_m_2_tel_box img{width: 20px; }
.xn_m_2_head .close{cursor:pointer;text-align: left;margin-top: 13px;display: none;}
.xn_m_2_mbox ul{}
.xn_m_2_markrt_code img{width: 100px;}
.xn_m_2_small_but { width:20px; height:50px; background:#666666; position:absolute; top:50%; margin-top:-25px; right:0px; cursor:pointer; color:#fff; font-size:12px; display:none; text-align:center; line-height:24px; }
.xn_m_2_foot{transition: all 0.6s ease 0s;width: 59px;    overflow: hidden;height: 59px;background:#fff url(img/top1.png)no-repeat;cursor: pointer;font-size:0px;color:#fff;line-height: 110px;text-align: center;border: 1px solid #eeeeee;border-top: none;}
.xn_m_2_foot:hover{background:#637d8e url(img/top11.png)no-repeat;}
.xn_m_2_orderId{display: none;}
.xn_m_2_mbox{position:relative;width:70px;}
.xn_m_2_markrt_ali{ display:none;}
#xn_m_2_Text4{ font-size:12px; display:none;padding: 6px 4px; background:url(img/xuan_hover.png) no-repeat;}
#xn_m_2_Text1{ display:none;}
.xn_m_2_markrt_code{ background:url(img/xuan_erweima.png) no-repeat;cursor: pointer;}
.xn_m_2_markrt_code:hover #xn_m_2_Text4{ display:block;}
.xn_m_2_markrt_code:hover .xn_m_2_markrtimg{ display:block;}
.xn_m_2_telephone{transition: all 0.6s ease 0s;  cursor: pointer;width: 59px;height: 59px;margin-top: -10px;background: #fff;border: 1px solid #eeeeee; border-bottom: none; background:#fff url(img/shouji.png)no-repeat;background-size: 100%;border-top: none;}
.xn_m_2_telephone:hover{background: #fff3ea url(img/pp.png) center 10px no-repeat;}
.xn_m_2_telephone:hover .xn_m_2_telephone>h4{ display:block;}
.xn_m_2_telephone:hover .xn_m_2_tel_box{ opacity: 1;}
.xn_m_2_telephone:hover{ background:#fff url(img/11111.jpg)no-repeat;border: 1px solid #eeeeee; border-bottom: none;background-size: 100%; 	border-top: none;}
.xn_m_2_markrt_qq{margin-top: 52px;}
.xn_m_2_sky_author{display: none;}
.xn_m_2_markrt_qq:hover .xn_m_2_qq_li{ display:block;}
.xn_m_2_telephone h4{ display: none; left: 7px; color:#fff;text-align: center; height:22px; font-size:14px; font-weight:normal;overflow: hidden; position: absolute; bottom: 0px; }
.xn_m_2_markrtimg{ display:none;position: absolute;right: 48px;top: -28px;}
.xn_m_2_tel_box{ transition: all 0.6s ease 0s;  position:absolute;right: 59px;top: 0px;width:168px;height: 59px;line-height: 59px;color: #fff;background: #637d8e;opacity: 0;}
.xn_m_2_tel_tel{ margin-left:20px;font-size: 19px;}
.xn_m_2_qq_li:nth-of-type(1){display: none!important;}
.xn_m_2_qq_li{transition: all 0.6s ease 0s;width: 59px;height: 69px;background: #fff3ea;margin-bottom: 10px;overflow:hidden;border: 1px solid #eeeeee;border-bottom: none;margin-top: 62px;}
.xn_m_2_qq_li a:hover{ background: #637d8e   url(img/yijian.png)no-repeat 6px 15px;}
.xn_m_2_qq_li a{transition: all 0.6s ease 0s;font-size:14px;color:#fff;display:block;text-align: center;line-height: 110px;font-size: 0px;background:#fff url(img/yijian11.png)no-repeat 6px 15px;}
.xn_m_2_qq_img{ display:none;}
.xn_m_2_markrt_sky h4{ display:none;}
.xn_m_2_markrt_sky{transition: all 0.6s ease 0s; width: 59px;height: 59px;background: #fff;position:absolute;top: 22px;left:0;border: 1px solid #eeeeee;border-bottom: none;  background: #fff url(img/onli.png)no-repeat center;}
.xn_m_2_markrt_sky:hover{opacity: 0.8;cursor: pointer; background:#637d8e url(img/onli111.png)no-repeat center;}
.xn_m_2_markrt_sky a{cursor: pointer; background: url(img/ph.png)no-repeat center 10px;display:block;color:#fff;font-size:14px;text-align: center;line-height:110px;}
#qrcode,#qrAPPIOS,#qrAPPAndroid{display: none;}
#newBridge .icon-right-center{top:46%!important;}
.i_tcase_main .pcba{}
.i_tcase_main .pcba{}

/*首页新闻*/
.news_wrap{width: 100%;background: #fff;padding-bottom: 50px;}
.title {height:52px;line-height:48px;border-bottom: 1px solid #ddd;font-size:18px;color:#333}
.title a {float:right;font-size:12px;color:#207A7C}
.fl{float: left;}
.fr{float: right;}
.news-faq {margin-top:70px;width: 1200px;margin: 0 auto;}
.news {width:700px}
.news .nTab {position:relative}
.none {display:none}
.news .nTab .TabTitle {position:relative;height:52px;border-bottom: 1px solid #ddd;}
.news .nTab .TabTitle li {position:relative;float:left;margin-top:13px;padding:0 23px;font-size:18px;font-weight:bold;color:#8b8b8b;cursor:pointer;text-align:center}
.news .nTab .TabTitle li{border-right:2px #8b8b8b solid}
.news .nTab .TabTitle li:last-child {border:none}
.news .nTab .TabTitle .active {color:#333}
.news .nTab .TabTitle .normal {color:#8b8b8b}
.news .pro-more {position:absolute;top:18px;right:0;color:#207A7C}
.news .nTab .TabContent {display:block}
.TabContent dl {height:188px;overflow:hidden;margin-top:26px}
.TabContent dl dt {float:left;width:250px;position:relative}
.TabContent dl dt img {display:block;width:250px;height:188px}
.TabContent dl dt a p {text-overflow: ellipsis; position:absolute;left:0;bottom:0;width:100%;white-space:nowrap;overflow:hidden;text-align:center;float:none;background:url(img/black.6.png);background:rgba(0,0,0,.6);line-height:3;color:#fff !important}
.TabContent dl dt a:hover p {background:#207A7C}
.TabContent dl dd {float:right;width:440px}
.TabContent dl dd a:hover {text-decoration:underline}
.TabContent dl dd h4 {height:27px;line-height:27px;overflow:hidden;text-overflow:ellipsis}
.TabContent dl dd h4 a {font-size:14px;font-weight:normal;color:#207A7C}
.TabContent dl dd p {height:57px;line-height:19px;overflow:hidden;margin:5px 0;color:#1d1d1d;text-overflow:ellipsis}
.TabContent dl dd li {height:27px;line-height:27px;overflow:hidden;padding-left:15px;background-image:url(img/news_dian.png);background-position:left center;background-repeat:no-repeat}
.TabContent dl dd li span {float:right;color:#207A7C}
.TabContent dl dd li a {display:inline-block;width:310px;height:25px;line-height:25px;white-space: nowrap; text-overflow:ellipsis;overflow:hidden;color:#1d1d1d;text-decoration: none;}
.TabContent dl dd li a:hover{text-decoration: none;}.faq_index {width:450px}
.faqlist {margin-top:26px}
.faqlist dl {margin-bottom:15px}
.faqlist dl dt {min-height:20px;line-height:20px;padding-left:36px;position: relative;}
.faqlist dl dt .q{background:#207A7C url(img/q0.png) left top no-repeat;background-size: 24px auto;position: absolute;left: 0;top: 0;width: 24px;height: 20px;}
.faqlist dl dt a {font-size:14px;color:#1d1d1d}
.faqlist dl dt a:hover {color:#207A7C}
.faqlist dl dd {min-height:20px;line-height:20px;margin-top:10px;padding-left:36px;color:#1d1d1d;position: relative;}
.faqlist dl dd .a{background:#207A7C url(img/a0.png) left top no-repeat;background-size: 24px auto;position: absolute;left: 0;top: 0;width: 24px;height: 20px;}

.search-box{width: 1200px; margin: 0 auto;display: flex;align-items: center;justify-content: space-between;padding: 30px 0;}
.search-box .sl{width: 580px;font-size: 16px;font-weight: bold;}
.search-box .sl a{padding:0 10px;font-weight: normal;}
.search-box .sr{width: 580px;display: flex;justify-content: flex-end;}
.search-box .sr .ssk{border: 1px solid #207A7C;line-height: 30px;width: 450px;padding: 5px 20px;color: #207A7C;border-radius: 20px 0 0 20px;font-size: 16px}
.search-box .sr .sbtn{height: 42px; line-height: 42px;width: 80px;background:#207A7C;color: #fff;cursor: pointer;border-radius: 0 20px 20px 0;font-size: 16px;}